import { Meta, ColorPalette, ColorItem } from '@storybook/addon-docs/blocks'
import { color } from './components/shared/style'

<Meta title="概览 /颜色" />

# Colors

<ColorPalette>
	<ColorItem
		title="theme.color.primary"
		subtitle="Coral"
		colors={[color.primary]}
	/>
	<ColorItem
		title="theme.color.secondary"
		subtitle="Blue"
		colors={[color.secondary]}
	/>
	<ColorItem
		title="theme.color.tertiary"
		subtitle="Grey"
		colors={[color.tertiary]}
	/>
	<ColorItem
		title="theme.color.positive"
		subtitle="Green"
		colors={[color.positive]}
	/>
	<ColorItem
		title="theme.color.warning"
		subtitle="Ochre"
		colors={[color.warning]}
	/>
	<ColorItem
		title="theme.color.negative"
		subtitle="Red"
		colors={[color.negative]}
	/>
	<ColorItem
		title="theme.color.orange"
		subtitle="Orange"
		colors={[color.orange]}
	/>
	<ColorItem title="theme.color.gold" subtitle="Gold" colors={[color.gold]} />
	<ColorItem
		title="theme.color.green"
		subtitle="Green"
		colors={[color.green]}
	/>
	<ColorItem
		title="theme.color.seafoam"
		subtitle="Seafoam"
		colors={[color.seafoam]}
	/>
	<ColorItem
		title="theme.color.purple"
		subtitle="Purple"
		colors={[color.purple]}
	/>
	<ColorItem
		title="theme.color.ultraviolet"
		subtitle="Ultraviolet"
		colors={[color.ultraviolet]}
	/>
	<ColorItem
		title="Monochrome"
		colors={[
			color.darkest,
			color.darker,
			color.dark,
			color.mediumdark,
			color.medium,
			color.mediumlight,
			color.light,
			color.lighter,
			color.lightest,
		]}
	/>
</ColorPalette>